<template>
	<view style="padding-bottom: 30rpx;">
		<view>
			<uni-search-bar @confirm="search" @input="input()" v-model="value" placeholder="名称搜索" :radius="100" clearButton="none" cancelButton="none" bgColor="#ffffff"></uni-search-bar>
		</view>
		<view style="display: flex;height: 40rpx;margin-top: 10rpx;" v-if="real">
			<view style="width: 374rpx;height: 32rpx;display: flex;border-right: 2rpx solid #D8D8D8;">
				<view style="margin: auto;display: flex;"@click="light" >
					<view style="font-size: 32rpx;line-height: 32rpx;">已检查</view>
					<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 12rpx;">{{finish}}</view>
				</view>	
			</view>
			<view style="width: 374rpx;height: 32rpx;display: flex;">
				<view style="margin: auto;display: flex;" @click="light1" >
					<view style="font-size: 32rpx;line-height: 32rpx;color: #388CFE;">未检查</view>
					<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 12rpx;color: #388CFE;">{{count}}</view>
				</view>	
			</view>
		</view>
		<view style="display: flex;height: 40rpx;margin-top: 10rpx;" v-else>
			<view style="width: 374rpx;height: 32rpx;display: flex;border-right: 2rpx solid #D8D8D8;">
				<view style="margin: auto;display: flex;"@click="light" >
					<view style="font-size: 32rpx;line-height: 32rpx;color: #388CFE;">已检查</view>
					<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 12rpx;color: #388CFE;">{{finish}}</view>
				</view>	
			</view>
			<view style="width: 374rpx;height: 32rpx;display: flex;">
				<view style="margin: auto;display: flex;" @click="light1" >
					<view style="font-size: 32rpx;line-height: 32rpx;">未检查</view>
					<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 12rpx;">{{count}}</view>
				</view>	
			</view>
		</view>
		<view v-if="real">
			
			<view v-for="(item,index) in listW" :key="index">
				<view style="width: 690rpx;margin-top: 30rpx;margin-left: 30rpx;background-color: #FFFFFF;border-radius: 12rpx;height:100%;padding-bottom: 16rpx;"  >
					<view @click="gotoXQ(item.id)" style="display: flex;">
						<view style="width: 520rpx;">
							<view style="font-size: 36rpx;line-height: 36rpx;margin-top: 30rpx;margin-left: 30rpx;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{item.name}}</view>
							<view style="font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;color: #666666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{item.address}}</view>
							<view style="font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;color: #666666;">{{item.corporation}} {{item.corporationMobile}}</view>
						</view>
						<view style="width: 114rpx;height: 124rpx;margin-top: 17rpx;margin-left: 30rpx;margin-top: 34rpx;">
							<image src="../../../static/coordinate@3x.png" style="width: 52rpx;height: 76rpx;padding-left: 32rpx;"></image>
							<view style="font-size: 32rpx;line-height: 32rpx;text-align: center;color: #FB9A17;">{{item.distance | filterDis}}km</view>
						</view>
					</view>
					<view v-if="level!=3">
						<view style="width: 690rpx;height: 1rpx;background-color: #D8D8D8;margin-top: 32rpx;"></view>
						<view style="display: flex;" @click="gotoEX(item.taskId,item.name,item.id)">
						<image src="../../../static/icon-jiancha@3x.png" style="width: 48rpx;height: 48rpx;margin-left: 256rpx;margin-top: 22rpx;"></image>
						<view style="color: #388CFE;font-size: 32rpx;line-height: 32rpx;margin-left: 2rpx;margin-top: 30rpx;">开始检查</view>
					</view>
					</view>
					
				</view>
				
			</view>	
			<image src="../../../static/img_k@3x.png" style="width: 362rpx;height: 360rpx;margin-top: 190rpx;margin-left: 208rpx;" v-if="listW.length === 0 && (isLoadMore=='noMore')"></image>
			<view v-else>
				<view v-show="isLoadMore" style="margin-bottom: 30rpx;">
					<uni-load-more :status="isLoadMore" :contentText="contentText" showText="false" @clickLoadMore="loadmore()"></uni-load-more>
				</view>
			</view>
		</view>	
		<view v-else >
			<view v-for="(i,index) in listY" :key="index">
			<view style="width: 690rpx;margin-top: 30rpx;margin-left: 30rpx;background-color: #FFFFFF;border-radius: 12rpx;padding-bottom: 16rpx;"v-if="i.count!=0" >
				<view >
					<view @click="gotoXQ(i.id)">
						<view>
							<view style="display: flex;">
								<view style="font-size: 36rpx;line-height: 36rpx;margin-top: 30rpx;margin-left: 30rpx;width: 500rpx;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;">{{i.name}}</view>
								<view style="width: 108rpx;height: 36rpx;background-color: rgba(255, 77, 79, 0.12);color: rgba(255, 77, 79, 1);font-size: 24rpx;line-height:36rpx ;margin-left: 10rpx;margin-top: 30rpx;text-align: center;border-radius: 4rpx;">{{i.count}}处隐患</view>
							</view>
							<view style="font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;color: #666666;">{{i.address}}</view>
							<view style="font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;color: #666666;">{{i.corporation}} {{i.corporationMobile}}</view>
						</view>
						<view style="color: #999999;font-size: 24rpx;line-height: 24rpx;margin-left: 30rpx;margin-top: 20rpx;">检查时间：{{i.createTime}}</view>
						<view style="color: #999999;font-size: 24rpx;line-height: 24rpx;margin-left: 30rpx;margin-top: 20rpx;">检查人：{{i.userName}}</view>
					</view>
					<view style="width: 690rpx;height: 1rpx;background-color: #D8D8D8;margin-top: 32rpx;"></view>
					<view style="display: flex;" @click="gotoRd(i.createTime,i.userName,i.count,i.anwserId,i.repair)">
						<image src="../../../static/iconCK@3x.png" style="width: 48rpx;height: 48rpx;margin-top: 22rpx;margin-left: 194rpx;"></image>
						<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 2rpx;margin-top: 30rpx;color: #388CFE;">查看隐患整改记录</view>
					</view>
				</view>
			</view>
			<view style="width: 690rpx;height: 276rpx;border-radius: 12rpx;margin-top: 20rpx;margin-left: 30rpx;background-color: #FFFFFF;padding-bottom: 40rpx;" v-else-if="i.count==0" @click="gotoXQ(i.id)">
				<view style="display: flex;">
					<view style="font-size: 36rpx;line-height: 36rpx;margin-top: 30rpx;margin-left: 30rpx;">{{i.name}}</view>
				</view>
				<view style="color: #666666;font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;">{{i.address}}</view>
				<view style="color: #666666;font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;">{{i.corporation}} {{i.corporationMobile}}</view>
				<view style="font-size: 24rpx;line-height: 24rpx;color: #999999;margin-top: 20rpx;margin-left: 30rpx;">检查时间：{{i.createTime}}</view>
				<view style="font-size: 24rpx;line-height: 24rpx;color: #999999;margin-top: 20rpx;margin-left: 30rpx;">检查人：{{i.userName}}</view>
			</view>
			<!-- <view style="width: 690rpx;height: 276rpx;margin-top: 30rpx;margin-left: 30rpx;background-color: #FFFFFF;border-radius: 12rpx;"v-else>
				<view>
					<view>
						<view style="font-size: 36rpx;line-height: 36rpx;padding-top: 30rpx;margin-left: 30rpx;">下应街道避灾中心</view>
						<view style="font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;color: #666666;">李关娣中学</view>
						<view style="font-size: 28rpx;line-height: 28rpx;margin-top: 20rpx;margin-left: 30rpx;color: #666666;">张三 12545457788</view>
					</view>
					<view style="color: #999999;font-size: 24rpx;line-height: 24rpx;margin-left: 30rpx;margin-top: 20rpx;">检查时间：2021-12-01 09:27:44</view>
					<view style="color: #999999;font-size: 24rpx;line-height: 24rpx;margin-left: 30rpx;margin-top: 20rpx;">检查人：刘海涛</view>
				</view>
			</view> -->
			</view>
			<image src="../../../static/img_k@3x.png" style="width: 362rpx;height: 360rpx;margin-top: 190rpx;margin-left: 208rpx;" v-if="listY.length === 0 && (isLoadMoreY=='noMore')"></image>
			<view v-else>
				<view v-show="isLoadMoreY" style="margin-bottom: 30rpx;">
					<uni-load-more :status="isLoadMoreY" :contentText="contentText" showText="false" @clickLoadMore="loadmoreY()"></uni-load-more>
				</view>
			</view>
		</view>
		<tanChuang ref="tanC"></tanChuang>
	</view>
</template>

<script>
	import tanChuang from '../components/tanChuang.vue'
	export default {
		components: {
			tanChuang
		},
		filters:{
			filterDis(e){
				 let num = e/1000
				 return num.toFixed(2)
			},
		},
		data() {
			return {
				real:true,
				active:true,
				yinhuan:'5',
				lngs:'',
				lats:'',
				taskId:'',
				range:'',
				areaName:'',
				list:[],
				finish:'',
				count:'',
				listW:[],
				page:1,
				isLoadMore:'more',
				contentText:{contentdown: "查看更多",contentrefresh: "正在加载...",contentnomore: "没有更多数据了"},
				listY:[],
				pageY:1,
				isLoadMoreY:'more',
				name:'',
				startTime:'',
				endTime:'',
				range:'',
				areaId:'',
				jiancha:'',
				level:'',
				tan:0,
				value:''
			}
		},
		methods: {
			input(e){
				console.log(e);
				
				
			},
			search(res){
				console.log(res.value);
				this.value=res.value
				if(this.active==true){
					this.pageY=1
					console.log('1241251356125');
					this.$myRequest({
						url:'/project_flood/v1/check/task/relation/owner/page',
						data:{"pageNum":this.page,"pageSize":100,"point":this.lngs+","+this.lats,"status":0,"name": this.name,"startTime": this.startTime,"endTime": this.endTime,"range": this.range,"areaId":this.areaId,"ownerName":res.value}
					}).then((res)=>{
						console.log(res);
						this.listW=res.data.data.list
						if(this.listW.length<res.data.data.total)
							{
								this.isLoadMore='more'
							}
						else
							{
								this.isLoadMore='noMore'
							}
					})
				}
				else{
					this.page=1
					this.$myRequest({
						url:'/project_flood/v1/check/task/relation/owner/page',
						data:{"pageNum":this.page,"pageSize":100,"point":this.lngs+","+this.lats,"status":1,"name": this.name,"startTime": this.startTime,"endTime": this.endTime,"range": this.range,"areaId":this.areaId,"ownerName":res.value}
					}).then((res)=>{
						console.log(res);
						this.listY=res.data.data.list
						if(this.listY.length<res.data.data.total)
							{
								this.isLoadMoreY='more'
							}
						else
							{
								this.isLoadMoreY='noMore'
							}
					})
				}
			},
			light(){
				this.real=false,
				this.active=false
				this.getmesY()
				this.value=''
				
			},
			light1(){
				this.real=true,
				this.active=true
				this.getmesW()
				this.value=''
			},
			gotoXQ(id){
				uni.navigateTo({
					url:`../../list/xiangqing?id=${id}`
				})
			},
			gotoRd(createTime,userName,count,anwserId,repair){
				uni.navigateTo({
					url:`../YHrecord?createTime=${createTime}&userName=${userName}&count=${count}&anwserId=${anwserId}&repair=${repair}`
				})
			},
			gotoEX(taskId,name,id){
				uni.navigateTo({
					url:`../DCexercise?taskId=${taskId}&name=${name}&id=${id}`
				})
			},
			change(){
				this.$refs.tanC.open()
				this.$refs.tanC.text=this.name
			},
			async getmesY(){
				this.$myRequest({
					url:'/project_flood/v1/check/task/relation/owner/page',
					data:{"pageNum":this.page,"pageSize":100,"point":this.lngs+","+this.lats,"status":1,"name": this.name,"startTime": this.startTime,"endTime": this.endTime,"range": this.range,"areaId":this.areaId}
				}).then((res)=>{
					this.listY=res.data.data.list
					this.finish=res.data.data.total
					if(this.listY.length<res.data.data.total)
						{
							this.isLoadMoreY='more'
						}
					else
						{
							this.isLoadMoreY='noMore'
						}
				})
			},
			async getmesW(){
				this.$myRequest({
					url:'/project_flood/v1/check/task/relation/owner/page',
					data:{"pageNum":this.page,"pageSize":100,"point":this.lngs+","+this.lats,"status":0,"name": this.name,"startTime": this.startTime,"endTime": this.endTime,"range": this.range,"areaId":this.areaId}
				}).then((res)=>{
					this.listW=res.data.data.list
					this.count=res.data.data.total
					if(this.count==0 && this.tan==0){
						this.change()
					}
					if(this.listW.length<res.data.data.total)
						{
							this.isLoadMore='more'
						}
					else
						{
							this.isLoadMore='noMore'
						}
				})
			},
			loadmore(){
				if(this.isLoadMore !== 'more') return
				this.page=this.page+1
				this.$myRequest({
					url: '/project_flood/v1/check/task/relation/owner/page',
					data: {"pageNum":this.page,"pageSize":100,"point":this.lngs+","+this.lats,"status":0,"name": this.name,"startTime": this.startTime,"endTime": this.endTime,"range": this.range,"areaId":this.areaId,"ownerName":this.value},
				}).then((res)=>{
					console.log(res);
					this.listW=this.listW.concat(res.data.data.list)
					if(this.listW.length<res.data.data.total)
						{
							this.isLoadMore='more'
						}
					else
						{
							this.isLoadMore='noMore'
						}
				})
			},
			loadmoreY(){
				if(this.isLoadMoreY !== 'more') return
				this.pageY=this.pageY+1
				this.$myRequest({
					url: '/project_flood/v1/check/task/relation/owner/page',
					data: {"pageNum":this.page,"pageSize":100,"point":this.lngs+","+this.lats,"status":1,"name": this.name,"startTime": this.startTime,"endTime": this.endTime,"range": this.range,"areaId":this.areaId,"ownerName":this.value},
				}).then((res)=>{
					console.log(res);
					this.listY=this.listY.concat(res.data.data.list)
					if(this.listY.length<=res.data.data.total)
						{
							this.isLoadMoreY='more'
						}
					else
						{
							this.isLoadMoreY='noMore'
						}
				})
			}
		},
		onLoad(options) {
			try {
			    
				const A = uni.getStorageSync('level');
				console.log(this.areaId);
				this.level=A;
			    if (A) {
			        // console.log(X);
			    }
				
			} catch (e) {
			    // error
			}
			console.log(options);
			// this.real=options.real;
			// if(this.real==''){
			// 	this.range=1
			// }
			// else{
			// 	this.range=0
			// }
			if(options.real!=undefined){
				if(options.real=='true'){
					this.real=false
					this.active=false
				}
				
			}
			this.taskId=options.taskId;
			this.areaName=options.areaName;
			this.finish=options.finish;
			this.count=options.count;
			this.name=options.name;
			this.startTime=options.startTime;
			this.endTime=options.endTime;
			this.range=options.range;
			this.areaId=options.areaId;
			this.areaName=options.areaName;
			this.jiancha=options.jiancha;
			if(options.tan!=undefined){
				console.log(options.tan);
				this.tan=options.tan
			}
			if(options.reals!=undefined){
				this.real=false,
				this.active=false
			}
			uni.setNavigationBarTitle({
				title:this.name
			});
			console.log(this.real,'11111');
			try {
			    const X = uni.getStorageSync('lng');
				this.lngs=X;
			    if (X) {
			        // console.log(X);
			    }
			} catch (e) {
			    // error
			}
			try {
			    const Y = uni.getStorageSync('lat');
				this.lats=Y
			    if (Y) {
			        // console.log(Y);
			    }
			} catch (e) {
			    // error
			};
			
		},
		onShow() {
			this.getmesY();
			this.getmesW()
		}
	}
</script>

<style>
page{background-color: #F5F5F8;}
</style>
